import { useMemo } from "react";
import EditPage, { createFields } from "../../Component/ResourceList/Edit";
import { LibAppView } from "@/lib";

import RouteLines from "./RouteLines";

const VenueRouteEdit = () => {
    const journeyData = LibAppView.useJourneyData();
    const editData = journeyData.currentStepState || {};
    const fields = useMemo(() => {
        return createFields([{
            label: "路线点位名称",
            name: "title",
            type: "Input",
            required: true,
            props: {
                placeholder: "需明确体现科普主题（如：“智慧农业”科技实践研学活动）。"
            }
        }, {
            label: "所属区域",
            name: "region",
            type: "Region",
            required: true,
        },{
            label: "研学路线简介",
            name: "description",
            type: "TextArea",
            required: true,
            props: {
                placeholder: "200字以内，突出科普主题、路线亮点及适宜人群，信息真实准确。"
            }
        }, {
            label: "联系方式",
            name: "contactors",
            type: "TextArea",
            required: true,
            props: { placeholder: "联系人姓名、电话" }
        }, {
            label: "研学时长",
            name: "duration",
            type: "Input",
            required: true,
            props: { placeholder: "明确半日、1日或2日等。"}
        }, {
            label: "研学路线点位",
            name: "lines",
            type: "Custom",
            "Component": RouteLines,
            fullColumn: true,
            required: true,
        }]);
    }, []);
    return <EditPage
            reviewRight={editData?.status > 0}
            initValues={{
                status: 1
            }}
            submitEndPoint="venue.venueRouteSubmit"
            fields={fields}
            buildResponse={(response: any) => {
                const region = response.province ? [ response.province || "320000", response.city, response.area ] : ["320000"];
                const openDate = response.openDate ? JSON.parse(response.openDate) : [];
                const images = response.openDate ? JSON.parse(response.images) : [];
                return {
                    ...response,
                    region,
                    openDate,
                    images
                }
            }}
            buildRequest={(formData: any) => {
                const region = formData.region || [];
                return {
                    ...formData,
                    status: 2,
                    approveMsg: "",
                    province: region[0],
                    city: region[1],
                    area: region[2],
                    openDate: JSON.stringify(formData.openDate || []),
                    images: JSON.stringify(formData.images || []),
                }
        }}/>;
};

export default VenueRouteEdit;
